<template>
  <div class="stitle">· 投稿信息 ·</div>
  <div class="_box0">
    <n-grid
      x-gap="8"
      y-gap="8"
      :cols="parseInt($cfg.sswd / 350) >= 2 ? 2 : parseInt($cfg.sswd / 350)"
    >
      <n-gi>
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>会战赛季：</div>
          </div>
          <div class="_2_val">
            <n-select
              :size="$cfg.sizebtn"
              placeholder="请选择赛季"
              :options="val.slist"
              v-model:value="val.qs.season"
              @update:value="ct.slseason"
            />
          </div>
        </div>
      </n-gi>
      <n-gi>
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>首领名称：</div>
          </div>
          <div class="_2_val">
            <n-select
              :size="$cfg.sizebtn"
              placeholder="请选择首领名称"
              label-field="name"
              value-field="name"
              :options="val.blist"
              v-model:value="val.v_editdata.boss"
              @update:value="ct.slboss"
            />
          </div>
        </div>
      </n-gi>
      <n-gi span="2" v-if="val.editwork_type == 'edit'">
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>首领属性：</div>
          </div>
          <div class="_2_val">
            <n-space>
              <template v-for="(item2, key2) in boss_em">
                <n-tag
                  @click="val.v_editdata.shu = key2"
                  class="team_sstag"
                  style="min-width: 50px"
                  :class="{ teamsstag_on: val.v_editdata?.shu?.includes(key2) }"
                  >{{ item2 }}</n-tag
                >
              </template>
            </n-space>
          </div>
        </div>
      </n-gi>
      <n-gi>
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>视频地址：</div>
          </div>
          <div class="_2_val">
            <n-input
              :size="$cfg.sizebtn"
              v-model:value="val.v_editdata.bv"
              type="text"
              style="min-width: 100%"
              placeholder="比如 BV14e41167BY 可以输入完整地址 上传自动转换"
            />
          </div>
        </div>
      </n-gi>
      <n-gi>
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>视频分P：</div>
          </div>
          <div class="_2_val">
            <n-input
              :size="$cfg.sizebtn"
              v-model:value="val.v_editdata.fp"
              type="text"
              placeholder="合集不用填写，旧版B站投稿请填1-999"
            />
          </div>
        </div>
      </n-gi>
      <n-gi>
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>发布作者：</div>
          </div>
          <div class="_2_val">
            <n-input
              v-model:value="val.v_editdata.user"
              type="text"
              :size="$cfg.sizebtn"
              placeholder="发布作者名称"
            />
          </div>
        </div>
      </n-gi>
      <n-gi>
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>说明标签：</div>
          </div>
          <div class="_2_val">
            <n-input
              v-model:value="val.v_editdata.bz"
              type="text"
              :size="$cfg.sizebtn"
              placeholder="如 443 高难 宝宝轴 新版轴"
            />
          </div>
        </div>
      </n-gi>
    </n-grid>
    <div style="margin-top: 8px"></div>
    <div class="_banr">
      <div class="_2_title2" style="width: 75px">
        <div>详细说明：</div>
      </div>
      <div class="_2_val">
        <n-input
          style="flex: 1"
          :size="$cfg.sizebtn"
          v-model:value="val.v_editdata.content"
          type="textarea"
          placeholder="显示在视频底部 用于补充"
        />
      </div>
    </div>
  </div>
  <div class="stitle">· 队伍信息 ·</div>
  <div class="_box0">
    <n-grid x-gap="8" y-gap="8" cols="1">
      <n-gi>
        <div
          style="
            background-color: var(--banr-bg);
            padding: 10px 8px;
            border-radius: 3px;
            display: flex;
            align-items: center;
            gap: 8px;
            flex-direction: column;
          "
        >
          <m-role
            :ban="['ghz']"
            :showwepon="true"
            :maxlimit="4"
            :data="val.v_editdata.icdata"
            :listname="['主控', 'AI', 'AI', 'AI']"
          ></m-role>
        </div>
      </n-gi>

      <n-gi span="2">
        <div class="_banr">
          <div class="_2_title2" style="min-width: 75px">
            <div>队伍属性：</div>
          </div>
          <div class="_2_val">
            <div class="_3_div">
              <n-space>
                <template v-if="!$cfg.mobile" v-for="(item2, key2) in team_em">
                  <n-tag
                    @click="val.v_editdata.tl = key2"
                    class="team_sstag"
                    :class="{ teamsstag_on: val.v_editdata?.tl?.includes(key2) }"
                    >{{ item2 }}</n-tag
                  >
                </template>
                <template v-else v-for="(item2, key2) in team_em2">
                  <n-tag
                    @click="val.v_editdata.tl = key2"
                    class="team_sstag"
                    :class="{ teamsstag_on: val.v_editdata?.tl?.includes(key2) }"
                    >{{ item2 }}</n-tag
                  >
                </template>
              </n-space>
            </div>
          </div>
        </div>
      </n-gi>
      <n-gi span="2">
        <div class="_banr">
          <div class="_2_title2" style="width: 75px">
            <div>装备遗器：</div>
          </div>
          <div class="_2_val">
            <div class="_3_div">
              <n-space>
                <template v-for="(item2, key2) in team_yq">
                  <n-tag
                    @click="val.v_editdata.yq = item2"
                    class="team_sstag"
                    :class="{ teamsstag_on: val.v_editdata?.yq?.includes(item2) }"
                    >{{ item2 }}</n-tag
                  >
                </template>
              </n-space>
            </div>
          </div>
        </div>
      </n-gi>
    </n-grid>
  </div>
</template>

<script>
import { cfg } from "@/cfg/cfg.js";
export default {
  props: {
    val: {
      type: Object,
      required: true,
    },
    ct: {
      type: Object,
      required: true,
    },
  },
  methods: {
    elalert(title, text) {
      this.val.editalert = true;
      this.val.editalert_title = title;
      this.val.editalert_text = text;
      this.$cfg.msg.error(text, { duration: 2e3 });
    },
    new_editzy(data) {},
  },
  setup(props) {
    const val = props.val;
    const selectInstRef = ref(null);
    const ct = props.ct;

    val.ick = [];

    ct.searole = (key, tp) => {
      val.sea_role = "";
      val.dtrole = val.role.slice();
      if (tp == "pc") {
        const lth = selectInstRef.value.length;
        if (val.ick[key] == null) {
          val.ick[key] = lth - 1;
        }
        selectInstRef.value?.[val.ick[key]]?.focus();
      }
    };

    const set = {
      rolelabel: (option) => {
        if (option.value != null) {
          return h(
            "div",
            {
              class: "select_div",
            },
            [
              h("img", {
                class: "select_ava",
                src: cfg.function.ava(option.value),
                width: 32,
              }),
              h("div", {
                //html内容
                innerHTML: option.label2,
                style: {
                  marginLeft: "12px",
                  padding: "4px 0",
                },
              }),
            ]
          );
        } else {
          return h(
            "div",
            {
              style: {
                display: "flex",
                alignItems: "center",
              },
            },
            [
              h("div", {
                //html内容
                innerHTML: option.label,
                style: {
                  marginLeft: "12px",
                  padding: "4px 0",
                },
              }),
            ]
          );
        }
      },
    };

    const boss_em = {
      光: "光",
      暗: "暗",
      虚: "虚",
      水: "水",
      土: "土",
      火: "火",
    };
    const team_em = {
      光队: "光队",
      暗队: "暗队",
      虚队: "虚队",
      水队: "水队",
      土队: "土队",
      火队: "火队",
      五彩: "通用",
    };

    const team_em2 = {
      光队: "光",
      暗队: "暗",
      虚队: "虚",
      水队: "水",
      土队: "土",
      火队: "火",
      五彩: "通用",
    };

    const role_yc = {
      专: "本专",
      "2专": "二专",
      光: "光武器",
      暗: "暗武器",
      虚: "虚武器",
      水: "水武器",
      土: "土武器",
      火: "火武器",
    };

    const team_yq = ["不填", "杯", "书"];

    return {
      boss_em,
      set,
      selectInstRef,
      team_em,
      team_yq,
      role_yc,
      team_em2,
    };
  },
};
</script>
